<!DOCTYPE html>
<html>
<head>
  <meta name="keywords" content="">
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0">
  <link rel="shortcut icon" type="image/png" href="favicon.ico" />

  <title>Blog</title>
  <%= csrf_meta_tags %>

  <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
  <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
  <%= javascript_include_tag 'blocs', 'data-turbolinks-track': 'reload' %>
</head>

<body>
<!-- Main container -->
<div class="page-container">

  <!-- bloc-0 TODO 整理这些class-->
  <div class="bloc my-header bg-camera bgc-white l-bloc" id="bloc-0">
    <div class="container bloc-sm">
      <nav class="navbar row">
        <div class="navbar-header">
          <a class="navbar-brand" href="/">
            <%= image_tag 'logo.png', { height: 48, width: 48, alt: 'MINE'} %>
            MINE
          </a>
          <button id="nav-toggle" type="button" class="ui-navbar-toggle navbar-toggle" data-toggle="collapse" data-target=".navbar-1">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
        </div>
        <div class="collapse navbar-collapse navbar-1">
          <ul class="site-navigation nav navbar-nav">
            <li>
              <a href="blog-list.html" class="ltc-white">Blogs</a>
            </li>
            <li>
              <a href="blog-list.html" class="ltc-white">Notes</a>
            </li>
            <li>
              <a href="footprint.html" class="ltc-white">Footprints</a>
            </li>
            <li>
              <a href="about.html" class="ltc-white">About</a>
            </li>
          </ul>
        </div>
      </nav>
    </div>
  </div>
  <!-- bloc-0 END -->


  <%= yield %>

  <!-- ScrollToTop Button -->
  <a class="bloc-button btn scrollToTop" onclick="scrollToTarget('1')"><span class="fa fa-chevron-up"></span></a>
  <!-- ScrollToTop Button END-->


  <!-- Footer - bloc-9 -->
  <div class="bloc l-bloc bgc-white" id="bloc-9">
    <div class="container bloc-sm">
      <div class="row">
        <div class="col-sm-12 col-md-6 col-md-offset-3">
          <div class="col-xs-3 text-center">
            <a class="social" href="#"><span class="fa fa-twitter icon-md"></span></a>
          </div>
          <div class="col-xs-3 text-center">
            <a class="social" href="#"><span class="fa fa-facebook icon-md"></span></a>
          </div>
          <div class="col-xs-3 text-center">
            <a class="social" href="#"><span class="fa fa-dribbble icon-md"></span></a>
          </div>
          <div class="col-xs-3 text-center">
            <a class="social" href="#"><span class="fa fa-instagram icon-md"></span></a>
          </div>
        </div>
      </div>
    </div>
  </div>
  <!-- Footer - bloc-9 END -->
</div>
<!-- Main container END -->
</body>
</html>
